<script setup>
/**
 * @description countUp.js
 * @date 2024-02-02 星期五
 * @link https://www.npmjs.com/package/countup.js
 */
import { CountUp } from "countup.js";
let countup = ref(null);
let defprops = defineProps({
  start: {
    type: Number,
    default: 0
  },
  end: {
    type: Number,
    default: 0
  },
  duration: {
    type: Number,
    default: 2
  },
  options: {
    type: Object,
    default() {
      return {};
    }
  }
});

/**
 * @author 张维金
 * @date 2024-02-02 星期五
 * @function 初始化countUp
 */
let initCountUp = () => {
  defprops.options.duration = defprops.duration;
  defprops.options.start = defprops.start;
  new CountUp(countup.value, defprops.end, defprops.options).start();
};

watch(
  () => defprops.end,
  () => nextTick(() => initCountUp()),
  { immediate: true }
);
</script>

<template>
  <span ref="countup"></span>
</template>
